// 企业发布职位
import React, { Component } from 'react'
import {
    View,
    Text,
    TextInput,
    TouchableOpacity,
    ScrollView,
    DeviceEventEmitter,
} from 'react-native';

import { Cpublishprobody_Style as styles } from '../../../styles';
import Icon from 'react-native-vector-icons/Ionicons';
var Dimensions = require('Dimensions');
var width = Dimensions.get('window').width;
import ChooseUtil from '../../util/chooseUtil';

import { InsertPostionAction } from '../../actions/postion_c';      //加载action
import { connect } from 'react-redux';
import { bindActionCreators } from 'redux';

class Cpublishpro_body extends Component {
    constructor(props) {
        super(props);
        this.state = {
            xzPostion: {},
            city: true
        }
    };

    componentDidUpdate() {
        if (!this.state.xzPostion.companyId && this.props.xzPostion.companyId) {
            this.setState({ xzPostion: this.props.xzPostion })
        }
    }

    render() {
        return (
            <ScrollView style={[styles.pub_all, { width: width * 1 }]}>

                <View style={styles.pub_eve2}>
                    <View style={styles.pub_sma2}>
                        <Text style={styles.pub_txtname}>职位名称</Text>
                        <TextInput
                            style={[styles.inputname, { width: width * 0.7 }]}
                            underlineColorAndroid="transparent"
                            onChangeText={this.postionName.bind(this)} />
                    </View>

                    <View style={styles.pub_sma2}>
                        <Text style={styles.pub_txtname}>学历要求</Text>
                        <ChooseUtil ref="chooseUtil" rollback={this._go.bind(this)} />
                        <TouchableOpacity style={[styles.pub_touch1, { width: width * 0.7 }]}
                            onPress={() => { this.show() }}>
                            <Text style={styles.pub_txt2}>{this.state.xzPostion.postionEducation ? this.state.xzPostion.postionEducation : '选择学历'}</Text>
                        </TouchableOpacity>
                    </View>

                    <View style={styles.pub_sma2}>
                        <Text style={styles.pub_txtname}>经验要求</Text>

                        <ChooseUtil ref="chooseUtil" rollback={this._go.bind(this)} />
                        <TouchableOpacity onPress={() => { this.show2() }}
                            style={[styles.pub_touch1, { width: width * 0.7 }]}>
                            <Text style={styles.pub_txt2}>{this.state.xzPostion.postionExp ? this.state.xzPostion.postionExp : '选择经验'}</Text>
                        </TouchableOpacity>

                    </View>
                </View>

                <View style={styles.pub_eve3}>
                    <View style={styles.pub_sma2}>
                        <Text style={styles.pub_txtname}>公司地点</Text>
                        <TouchableOpacity
                            style={[styles.pub_touch1, { width: width * 0.7 }]}
                            onPress={() => {
                                this.props.navigation.navigate('cityList', { 'callback': this.postionSpace.bind(this) });
                            }}>
                            <Text style={styles.pub_txt2}>
                                {this._showpostionSpace(this.props.xzPostion.postionSpace)}
                            </Text>
                        </TouchableOpacity>
                    </View>
                    <View style={styles.pub_sma2}>
                        <Text style={styles.pub_txtname}>最低月薪</Text>
                        <TextInput
                            style={[styles.inputname, { width: width * 0.7 }]}
                            underlineColorAndroid="transparent"
                            placeholder='最低月薪'
                            keyboardType='numeric'
                            onChangeText={this.postionMm.bind(this)}
                        />
                    </View>
                    <View style={styles.pub_sma2}>
                        <Text style={styles.pub_txtname}>最高月薪</Text>
                        <TextInput
                            style={[styles.inputname, { width: width * 0.7 }]}
                            underlineColorAndroid="transparent"
                            placeholder='最高月薪'
                            keyboardType='numeric'
                            onChangeText={this.postionYm.bind(this)}
                        />
                    </View>
                </View>

                <TouchableOpacity onPress={() => { this.props.navigation.navigate('Cdescribe_all', { 'rollback': this.postionDescription.bind(this) }) }}
                    style={styles.pub_eve4}>
                    <View style={{ height: 119, overflow: 'hidden', backgroundColor: '#ffffff' }}>
                        <Text style={styles.pub_txt3}>职位描述</Text>
                        <Text style={styles.pub_txt3}>
                            {this.state.xzPostion.postionDescription ? this.state.xzPostion.postionDescription : '点击输入职位描述'}
                        </Text>
                    </View>
                    <Icon
                        name={'ios-create'}
                        size={20}
                        color={'#3d9ccc'} style={styles.pub_icon3} />
                </TouchableOpacity>

                <Text style={styles.pub_txt4}>请认真填写职位信息，以提高职位通过率</Text>

                <View style={styles.pub_tb}>
                    <TouchableOpacity
                        activeOpacity={1}
                        style={[styles.pub_button, { width: width * 0.8 }]}
                        onPress={() => {
                            const p = {
                                companyId: this.state.xzPostion.companyId,
                                postionName: this.state.xzPostion.postionName,
                                postionEducation: this.state.xzPostion.postionEducation,
                                postionExp: this.state.xzPostion.postionExp,
                                postionSpace: this.state.xzPostion.postionSpace,
                                postionMm: this.state.xzPostion.postionMm,
                                postionYm: this.state.xzPostion.postionYm,
                                postionDescription: this.state.xzPostion.postionDescription,
                                postionWelfare: 1
                            };
                            this.props.actions.InsertPostionAction(p);
                            DeviceEventEmitter.emit('Cmanage_body2');
                            this.props.navigation.goBack();
                        }}>
                        <Text style={styles.pub_txt5}>发布职位</Text>
                    </TouchableOpacity>
                </View>
            </ScrollView >
        )
    }

    _showpostionSpace(postionSpace){
        let a = '选择'
        if(postionSpace){
            return postionSpace;
        }else {
            return a;
        }
    }

    // 教育
    show() {
        this.refs.chooseUtil.initPicker("education");
        this.refs.chooseUtil.picker.show();
        this.refs.chooseUtil.setState({
            isModal: true
        })
    }
    // 经验
    show2() {
        this.refs.chooseUtil.initPicker("experience");
        this.refs.chooseUtil.picker.show();
        this.refs.chooseUtil.setState({
            isModal: true
        })
    }
    //公司
    show3() {
        this.refs.chooseUtil.initPicker("company");
        this.refs.chooseUtil.picker.show();
        this.refs.chooseUtil.setState({
            isModal: true
        })
    }

    show4() {
        this.refs.chooseUtil.initPicker("state");
        this.refs.chooseUtil.picker.show();
        this.refs.chooseUtil.setState({
            isModal: true
        })
    }

    _go(key) {
        if (key.type == "education") {
            this.postionEducation(key.data);
        } else if (key.type == "experience") {
            this.postionExp(key.data);
        }
    }
    //职位名称
    postionName(a) {
        const xzPostion = this.state.xzPostion;
        xzPostion.postionName = a;
        this.setState({ xzPostion: xzPostion });
    }
    //学历要求
    postionEducation(key) {
        const xzPostion = this.state.xzPostion;
        xzPostion.postionEducation = key;
        this.setState({ xzPostion: xzPostion });
    }
    education() {
        // 选择学历
    }
    //经验要求
    postionExp(key) {
        const xzPostion = this.state.xzPostion;
        xzPostion.postionExp = key;
        this.setState({ xzPostion: xzPostion });
    }
    exp() {

    }
    //工作地点
    postionSpace(key) {
        const xzPostion = this.state.xzPostion;
        xzPostion.postionSpace = key;
        this.setState({ xzPostion: xzPostion });
    }
    //最低月薪
    postionMm(a) {
        const xzPostion = this.state.xzPostion;
        if (isNaN(a) || a == '') {
            xzPostion.postionMm = 0;
        } else {
            xzPostion.postionMm = a;
        }
        this.setState({ xzPostion: xzPostion });
    }
    //最高月薪
    postionYm(a) {
        const xzPostion = this.state.xzPostion;
        if (isNaN(a) || a == '') {
            xzPostion.postionYm = 0;
        } else {
            xzPostion.postionYm = a;
        }
        this.setState({ xzPostion: xzPostion });
    }
    //职位描述
    postionDescription(a) {
        const xzPostion = this.state.xzPostion;
        xzPostion.postionDescription = a;
        this.setState({ xzPostion: xzPostion });
    }
}

//组合action
var actions = {
    InsertPostionAction
}

//连接state到props
const mapStateToProps = state => {
    return {
        msg: state.InsertPostionReducer
    }
}

//连接action
const mapDispatchToProps = (dispatch) => {
    return {
        actions: bindActionCreators(actions, dispatch)
    }
}

//导出组合好的组件(组合后状态改变重新渲染组合组件的页面)
export default connect(
    mapStateToProps, mapDispatchToProps
)(Cpublishpro_body);